<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <input type="text" id="inp" />
    <span id="span"></span>
    <script>
      const inp = document.getElementById('inp')
      const span = document.getElementById('span')
      const obj = {}
      // 对obj的msg属性进行重新定义
      Object.defineProperty(obj, 'msg', {
        // 当给obj.msg赋值时,set触发
        set(value) {
          // console.log('set执行了')
          span.innerText = value
        },
        // 当获取obj.msg的值时,get触发
        // get() {
        //   console.log('get执行了')
        // },
      })
      // console.log(obj)
      // obj.msg = '123'
      // console.log(obj.msg)
      inp.oninput = function () {
        obj.msg = this.value
      }
    </script>
  </body>
</html>
